<html>
<head>
  <title>Electron</title>
  <style>
    body {
      color: #555;
      font-family: 'Open Sans',Helvetica,Arial,sans-serif;
      padding: 30px;
    }

    h2 {
      color: #2b6cc2;
      font-family: "Crimson Text",Georgia,serif;
      font-weight: 400;
      line-height: 1.1;
      letter-spacing: -0.015em;
    }

    a {
      color: #2b6cc2;
      text-decoration: none;
    }
    a:hover {
      text-decoration: underline;
    }

    pre, code {
      font-family: "Menlo","Lucida Console",monospace;
      border: 1px solid #ddd;
      background-color: #f8f8f8;
      border-radius: 3px;
    }

    pre {
      white-space: pre-wrap;
      font-size: 13px;
      line-height: 19px;
      overflow: auto;
      padding: 6px 10px;
    }

    #holder {
      border: 4px dashed #ccc;
      margin: 0 auto;
      height: 300px;
      color: #ccc;
      font-size: 40px;
      line-height: 300px;
      text-align: center;
      -webkit-user-select: none;
    }
    #holder.hover {
      border: 4px dashed #999;
      color: #eee;
    }
  </style>
</head>
<body>
  <script>
    var execPath = require('remote').process.execPath;
    var command = execPath + ' path-to-your-app';

    document.onclick = function(e) {
      e.preventDefault();
      if (e.target.tagName == 'A')
        require('shell').openExternal(e.target.href);
      return false;
    };
    document.ondragover = document.ondrop = function(e) {
      e.preventDefault();
      return false;
    };
  </script>

  <h2 style="-webkit-app-region: drag">Welcome to Electron</h2>

  <p>
  To run your app with Electron, execute the following command under your
  Console (or Terminal):
  </p>

  <script>document.write('<pre>' + command + '</pre>')</script>

  <p>
  The <code>path-to-your-app</code> should be the path to your own Electron
  app, you can read the <a href='https://github.com/atom/electron/blob/master/docs/tutorial/quick-start.md'>quick start</a>
  guide in Electron's <a href='https://github.com/atom/electron/blob/master/docs'>docs</a>
  on how to write one.
  </p>

  <p>
  Or you can just drag your app here to run it:
  </p>

  <div id="holder">
    Drag your app here to run it
  </div>

  <script>
    var holder = document.getElementById('holder');
    holder.ondragover = function () {
      this.className = 'hover';
      return false;
    };
    holder.ondragleave = holder.ondragend = function () {
      this.className = '';
      return false;
    };
    holder.ondrop = function (e) {
      this.className = '';
      e.preventDefault();

      var file = e.dataTransfer.files[0];
      require('child_process').execFile(execPath, [file.path], {
        detached: true, stdio: 'ignore'
      }).unref();
      return false;
    };
  </script>
</body>
</html>
